<template>
	<view class="barcode-content">
		<view class="barcode-title">
			读取成功
		</view>
		<view class="barcode-desrc">
			请选择访问内容类型
		</view>

		<!-- 类型 -->
		<view class="barcode-flex">
			<view class="barcode-item" @tap="barcodeTap(0)">
				<view class="barcode-item-img">
					<image src="/static/down/dictionary-rafiki.svg" mode="aspectFit" class="fengrui-img"></image>
				</view>
				<view class="barcode-item-title">
					访问详情页
				</view>
				<view class="barcode-item-desrc">
					Visit the details page
				</view>
			</view>
			<view class="barcode-item" v-if="detailData.fr_down_url != '' || detailData.fr_down_file != ''"
				@tap="barcodeTap(1)">
				<view class="barcode-item-img">
					<image src="/static/down/download-pana.svg" mode="aspectFit" class="fengrui-img"></image>
				</view>
				<view class="barcode-item-title">
					访问下载页
				</view>
				<view class="barcode-item-desrc">
					Visit the download page
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	// 获取应用实例
	const app = getApp()
	import * as API from "../../utils/api";
	export default {
		data() {
			return {
				posdCenterID: 0, //ID
				detailData: [],
			}
		},
		onLoad(ops) {
			//获取ID
			const scene = decodeURIComponent(ops.scene)
			this.posdCenterID = scene;

			if (app.globalData.wxSet == '') {
				//（解决异步）
				app.on('wxSet', this.changeToken.bind(this));
			} else {
				// 文章数据
				this.posdData();
			}
		},
		methods: {
			//（解决异步）
			changeToken() {
				this.wxSet = app.globalData.wxSet;
				// 文章数据
				this.posdData();
			},

			// 文章数据
			posdData() {
				API.getInfo([this.posdCenterID]).then((res) => {
					this.detailData = res.data;
				})
			},

			// 类型
			barcodeTap(e) {
				if (e == 0) {
					this.newPostTap();
				} else {
					uni.navigateTo({
						url: '../download/download?id=' + this.posdCenterID
					});
				}
			},

			// 文章列表点击 0正常阅读(默认值)，1跳转公众号，2跳转资源下载，3跳转视频号，4跳转b站
			newPostTap() {
				switch (this.detailData.pos_read) {
					case '':
						uni.navigateTo({
							url: '../data/data?id=' + this.posdCenterID
						})
						break;
					case '0':
						uni.navigateTo({
							url: '../data/data?id=' + this.posdCenterID
						})
						break;
					case '1':
						uni.navigateTo({
							url: '../weblist/weblist?aurl=' + this.detailData.account_url
						});
						break;
					case '2':
						uni.navigateTo({
							url: '../download/download?id=' + this.posdCenterID
						});
						break;
					case '3':
						uni.openChannelsActivity({
							finderUserName: this.detailData.wxvideo_id,
							feedId: this.detailData.wxvideo_feedid,
							success: (res) => {},
							fail: (err) => {
								// console.log(err)
							}
						})
						break;
					case '4':
						const aid = this.detailData.bz_video_av
						const timestamp = new Date().getTime()
						const path =
							`pages/video/video?__preload_=${timestamp*10+3}&__key_=${timestamp*10+4}&avid=${aid}`
						wx.navigateToMiniProgram({
							appId: 'wx7564fd5313d24844',
							path,
							success: res => {
								// console.log('跳转成功')
							}
						})
						break;
					case '5':
						uni.navigateTo({
							url: '../wall/wall?id=' +this.posdCenterID
						});
						break;
					case '6':
						uni.navigateTo({
							url: '../wall/wall?id=' + this.posdCenterID
						});
						break;
				}
			},
		}
	}
</script>

<style>
	.barcode-item-desrc {
		text-align: center;
		font-size: 24rpx;
		margin-top: 10rpx;
		color: #7c7c7c;
	}

	.barcode-item-title {
		text-align: center;
		font-size: 34rpx;
		font-weight: bold;
		margin-top: 30rpx;
	}

	.barcode-item-img {
		width: 260rpx;
		height: 260rpx;
		overflow: hidden;
	}

	.barcode-item {
		border-radius: 40rpx;
		background-color: #ffffff;
		padding: 60rpx 30rpx;
		/* box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.15); */
		overflow: hidden;
	}

	.barcode-flex {
		display: flex;
		width: calc(100% - 56rpx);
		margin-left: 28rpx;
		justify-content: space-around;
		margin-top: 120rpx;
	}

	.barcode-content {
		position: absolute;
		top: 40%;
		left: 50%;
		width: 100%;
		transform: translate(-50%, -50%);
	}

	.barcode-desrc {
		text-align: center;
		font-size: 28rpx;
		color: #7c7c7c;
	}

	.barcode-title {
		text-align: center;
		font-weight: bold;
		font-size: 40rpx;
		margin-bottom: 10rpx;
	}

	page {
		background-color: #F7F7F7;
	}


	/* 暗黑模式下应用的样式 */
	@media (prefers-color-scheme: dark) {
		page {
			background: #161616;
		}

		.barcode-item {
			background: #202020;
		}
	}
</style>